<template>
  <div class="Gzdingdan">
    <div class="gzDingdan-xianzhi">
      <div class="header" style="background-color: #F3F3F3; overflow: hidden">
        <span class="c1">商品订单列表</span>
        <div style="float: right;">
          <el-button size="mini" style="background-color: #FFFFFF" class="small-button" plain @click="returnPage"><i class="el-icon-arrow-left"></i>返回</el-button>
          <el-button size="mini" style="background-color: #FFFFFF" class="small-button" @click="shuaxin"><i class="el-icon-refresh-right"></i>刷新</el-button>
        </div>
      </div>

      <div class="dingdan-box3">
        <div style="margin-top: 40px">
          <el-timeline :reverse="reverse">
            <el-timeline-item
                v-for="(activity, index) in activities"
                :key="index"
                :timestamp="activity.timestamp">
              {{activity.content}}
            </el-timeline-item>
          </el-timeline>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default { //订单跟踪
  inject:['reload'],
  data(){
    return{
      orderI:this.$store.state.orderLogisticsNumber,
      reverse: true,
      activities: [{
        content: '2022-12-15',
        timestamp: '收到货物'
      }, {
        content: '2022-12-14',
        timestamp: '发货中'
      }, {
        content: '2022-12-13',
        timestamp: '开始发货'
      }]
    }
  },
  methods:{
    shuaxin(){
      //刷新页面的方法
      this.reload();
    },
    returnPage(){
      //此方法用来返回上一个页面
      if (window.history.length <= 1) {
        this.$router.push({ path: "/system/storageManagement" });
        return false;
      } else {
        this.$router.go(-1);
      }
    },
  }
}
</script>

<style scoped>
.Gzdingdan{
  width: 100%;
  height: 100%;
}
.gzDingdan-xianzhi{
  width: 1340px;
}
.dingdan-box1{
  color: #666666;
  line-height: 50px;
  height: 50px;
  background-color: #F3F3F3;
}
.dingdan-box2{
  width: 1000px;
  color: #666666;
  line-height: 40px;
  height: 40px;
  background-color: #F3F3F3;
  margin-top: 20px;
  border: 1px solid #E4E4E4;
}
.dingdan-box3{
  width: 1000px;
}

.header {
  margin: -10px -20px 0px -20px;
  height: 60px;
  border: 1px solid #E5E5E5;
}
</style>